var tips;
var toothId;
$("#projectListInfo").on('click', '.toothBox', function (e) {
    e.stopPropagation();
    $(".toothBox").removeClass('tips');
    $(this).addClass('tips');
    toothId = $(this).attr("id");
    var leftUpNum = $(this).find('.leftUp').text();
    var rightUpNum = $(this).find('.rightUp').text();
    var leftDownNum = $(this).find('.leftDown').text();
    var rightDownNum = $(this).find('.rightDown').text();
    tips = layer.open({
        type: 4,
        tips: [1, '#ffffff'],
        closeBtn: 0,
        area: ['auto', 'auto'],
        content: ['<div>' + $("#noneBox").html() + '</div>', '.tips'],
        success: function (layero, index) {
            if (leftUpNum.length > 0) {
                for (var w = 0; w < $(layero).find('.toothTopLeft>span').length; w++) {
                    for (var i = 0; i < leftUpNum.length; i++) {
                        if ($(layero).find('.toothTopLeft>span').eq(w).find('span').text() == leftUpNum.substring(i, i + 1)) {
                            $(layero).find('.toothTopLeft>span').eq(w).find('span').addClass('spanStyle');
                        }
                    }
                }
            }
            if (rightUpNum.length > 0) {
                for (var w = 0; w < $(layero).find('.toothTopRight>span').length; w++) {
                    for (var i = 0; i < rightUpNum.length; i++) {
                        if ($(layero).find('.toothTopRight>span').eq(w).find('span').text() == rightUpNum.substring(i, i + 1)) {
                            $(layero).find('.toothTopRight>span').eq(w).find('span').addClass('spanStyle');
                        }
                    }
                }
            }
            if (leftDownNum.length > 0) {
                for (var w = 0; w < $(layero).find('.toothBottomLeft>span').length; w++) {
                    for (var i = 0; i < leftDownNum.length; i++) {
                        if ($(layero).find('.toothBottomLeft>span').eq(w).find('span').text() == leftDownNum.substring(i, i + 1)) {
                            $(layero).find('.toothBottomLeft>span').eq(w).find('span').addClass('spanStyle');
                        }
                    }
                }
            }
            if (rightDownNum.length > 0) {
                for (var w = 0; w < $(layero).find('.toothBottomRight>span').length; w++) {
                    for (var i = 0; i < rightDownNum.length; i++) {
                        if ($(layero).find('.toothBottomRight>span').eq(w).find('span').text() == rightDownNum.substring(i, i + 1)) {
                            $(layero).find('.toothBottomRight>span').eq(w).find('span').addClass('spanStyle');
                        }
                    }
                }
            }
        }
    });
});
$(document).click(function () {
    layer.close(tips);
});
$(document).on('click', '.tipsUl>li', function (e) {
    e.stopPropagation();
    $(this).addClass('tipsLi').siblings().removeClass('tipsLi');
    if ($(this).index() == 0) {
        $(this).parent().siblings().children('#permanent').show().siblings().hide()
    } else if ($(this).index() == 1) {
        $(this).parent().siblings().children('#deciduous').show().siblings().hide()
    }
});
$(document).on('click', '.toothTopLeft>span', function (e) {
    e.stopPropagation();
    var arr = [];
    var text = $(this).text();
    if ($(this).children().hasClass('spanStyle')) {
        var inputValue = $(".tips .leftUp").text().replace(text, "");
        for (var i = 0; i < inputValue.length; i++) {
            arr.push(inputValue.substring(i, i + 1));
        }
        for (var i = arr.length - 1; i >= 0; i--) {
            for (var j = 0; j < i; j++) {
                if (arr[j + 1] > arr[j]) {
                    var change = arr[j + 1];
                    arr[j + 1] = arr[j];
                    arr[j] = change
                }
            }
        }
        var str = "";
        for (var i = 0; i < arr.length; i++) {
            str += arr[i]
        }
        $(".tips .leftUp").text(str);
        $(this).children().removeClass('spanStyle');
    } else {
        $(this).children().addClass('spanStyle');
        var add = $(".tips .leftUp").text() + text;
        for (var d = 0; d < add.length; d++) {
            arr.push(add.substring(d, d + 1));
        }
        for (var i = arr.length - 1; i >= 0; i--) {
            for (var j = 0; j < i; j++) {
                if (arr[j + 1] > arr[j]) {
                    var change = arr[j + 1];
                    arr[j + 1] = arr[j];
                    arr[j] = change
                }
            }
        }
        var str = "";
        for (var i = 0; i < arr.length; i++) {
            str += arr[i]
        }
        $(".tips .leftUp").text(str);
    }
});
$(document).on('click', '.toothTopRight>span', function (e) {
    e.stopPropagation();
    var arr = [];
    var text = $(this).text();
    if ($(this).children().hasClass('spanStyle')) {
        var inputValue = $(".tips .rightUp").text().replace(text, "");
        for (var i = 0; i < inputValue.length; i++) {
            arr.push(inputValue.substring(i, i + 1));
        }
        for (var i = arr.length - 1; i >= 0; i--) {
            for (var j = 0; j < i; j++) {
                if (arr[j + 1] < arr[j]) {
                    var change = arr[j + 1];
                    arr[j + 1] = arr[j];
                    arr[j] = change
                }
            }
        }
        var str = "";
        for (var i = 0; i < arr.length; i++) {
            str += arr[i]
        }
        $(".tips .rightUp").text(str);
        $(this).children().removeClass('spanStyle');
    } else {
        $(this).children().addClass('spanStyle');
        var add = $(".tips .rightUp").text() + text;
        for (var d = 0; d < add.length; d++) {
            arr.push(add.substring(d, d + 1));
        }
        for (var i = arr.length - 1; i >= 0; i--) {
            for (var j = 0; j < i; j++) {
                if (arr[j + 1] < arr[j]) {
                    var change = arr[j + 1];
                    arr[j + 1] = arr[j];
                    arr[j] = change
                }
            }
        }
        var str = "";
        for (var i = 0; i < arr.length; i++) {
            str += arr[i]
        }
        $(".tips .rightUp").text(str);
    }
});
$(document).on('click', '.toothBottomLeft>span', function (e) {
    e.stopPropagation();
    var arr = [];
    var text = $(this).text();
    if ($(this).children().hasClass('spanStyle')) {
        var inputValue = $(".tips .leftDown").text().replace(text, "");
        for (var i = 0; i < inputValue.length; i++) {
            arr.push(inputValue.substring(i, i + 1));
        }
        for (var i = arr.length - 1; i >= 0; i--) {
            for (var j = 0; j < i; j++) {
                if (arr[j + 1] > arr[j]) {
                    var change = arr[j + 1];
                    arr[j + 1] = arr[j];
                    arr[j] = change
                }
            }
        }
        var str = "";
        for (var i = 0; i < arr.length; i++) {
            str += arr[i]
        }
        $(".tips .leftDown").text(str);
        $(this).children().removeClass('spanStyle');
    } else {
        $(this).children().addClass('spanStyle');
        var add = $(".tips .leftDown").text() + text;
        for (var d = 0; d < add.length; d++) {
            arr.push(add.substring(d, d + 1));
        }
        for (var i = arr.length - 1; i >= 0; i--) {
            for (var j = 0; j < i; j++) {
                if (arr[j + 1] > arr[j]) {
                    var change = arr[j + 1];
                    arr[j + 1] = arr[j];
                    arr[j] = change
                }
            }
        }
        var str = "";
        for (var i = 0; i < arr.length; i++) {
            str += arr[i]
        }
        $(".tips .leftDown").text(str);
    }
});
$(document).on('click', '.toothBottomRight>span', function (e) {
    e.stopPropagation();
    var arr = [];
    var text = $(this).text();
    if ($(this).children().hasClass('spanStyle')) {
        var inputValue = $(".tips .rightDown").text().replace(text, "");
        for (var i = 0; i < inputValue.length; i++) {
            arr.push(inputValue.substring(i, i + 1));
        }
        for (var i = arr.length - 1; i >= 0; i--) {
            for (var j = 0; j < i; j++) {
                if (arr[j + 1] < arr[j]) {
                    var change = arr[j + 1];
                    arr[j + 1] = arr[j];
                    arr[j] = change
                }
            }
        }
        var str = "";
        for (var i = 0; i < arr.length; i++) {
            str += arr[i]
        }
        $(".tips .rightDown").text(str);
        $(this).children().removeClass('spanStyle');
    } else {
        $(this).children().addClass('spanStyle');
        var add = $(".tips .rightDown").text() + text;
        for (var d = 0; d < add.length; d++) {
            arr.push(add.substring(d, d + 1));
        }
        for (var i = arr.length - 1; i >= 0; i--) {
            for (var j = 0; j < i; j++) {
                if (arr[j + 1] < arr[j]) {
                    var change = arr[j + 1];
                    arr[j + 1] = arr[j];
                    arr[j] = change
                }
            }
        }
        var str = "";
        for (var i = 0; i < arr.length; i++) {
            str += arr[i]
        }
        $(".tips .rightDown").text(str);
    }
});